Use negative space in layouts 在佈局中使用留白

這是對“空間（Spacing）”在 UX 設計中作用的總結。它為你補齊了佈局的最後一塊拼圖 —— 如何讓內容有呼吸感，提升使用者體驗。

空間（White Space）的核心作用

在 UX 設計中，white space（空白） 也被稱作 negative space（負空間），指的是設計元素之間的間距，包括元件之間、段落之間、按鈕之間的所有留白。

白空間的三個關鍵作用

1. 強調重點內容

• 用空白環繞核心內容，使其脫穎而出。

• 案例：Google 首頁，白色背景突出了 logo 和搜尋框 —— 明確傳達“搜尋是核心操作”。

2. 幫助元素分組（Proximity）

• 空間的多寡影響使用者對內容關係的判斷。

• 視覺法則參考：格式塔理論中的“接近性原則”說明，靠得近的元素被視為一組。

• 案例圖示：左圖：16 個圓形排列緊密，看作一個整體；右圖：在第 2 和第 3 列之間留白，使用者自然會把它看作兩個獨立分組。

3. 增強可讀性與可用性

• 擁擠的排版容易讓使用者迷失焦點、感到壓迫。

• 案例：左邊：字型大、圖片大，空間緊張，閱讀困難。右邊：字型和圖片縮小，留出更多空白，頁面更易閱讀，體驗更舒適

空白不足的風險

• 誤觸操作：按鈕之間太近容易造成點選錯誤。

• 視覺雜亂：使用者無法明確知道該關注哪部分。

• 認知負擔：過度堆疊的資訊會讓使用者疲勞。

如何向團隊/客戶解釋白空間的價值

客戶常擔心“頁面空了是不是內容不夠？”這是一個認知誤區。你可以從以下角度解釋：

• 白空間不是浪費，而是幫助聚焦的手段。

• 它可以提高轉化率（如點選率、註冊率）。

• 優秀的設計中，“留白”比“填滿”更高明。